import React, { useState, useEffect, useRef } from 'react';
// import useCountDown from './useHook'
// TODO: 填写useCountDown

function useHook(n) {
    const [num, setNum] = useState(n)
    let timer 
    useEffect(() => {
        if(!num){  //  num == 0 的时候 就清除定时器
            clearTimeout(timer) 
            timer = null
        } else{
            timer = setTimeout(() => {
                setNum((num) => num - 1)
            }, 1000)
        }
        return () => {
            clearTimeout(timer) 
            timer = null
        }
    }, [num])
    return num

}


function Timer({ n }) {
  const time = useHook(n);
//   const time = useCountDown(n);
  
  return <span>{time === 0 ? '活动开始' : `剩余${time}秒`}</span>
}


export default Timer